<template>
  <div id="detail">
    <detailheader></detailheader>
    <banner></banner>
    <dtitle></dtitle>
    <recommend :list="list"></recommend>
  </div>
</template>

<script>
import banner from './components/banner.vue'
import Dtitle from './components/Dtitle.vue'
import detailheader from './components/detailheader.vue'
import recommend from './components/recommend.vue'
import axios from 'axios'
export default {
  name: 'detail',
  data () {
    return {
      list: []
    }
  },
  components: {
    banner,
    Dtitle,
    detailheader,
    recommend
  },
  methods: {
    getDetailData () {
      axios.get('api/detail.json?id=' + this.$route.params.id).then(this.getDetailDataSucc)
    },
    getDetailDataSucc (e) {
      console.log(e.data)
      this.list = e.data.list
    }
  },
  activated () {
    this.getDetailData()
  }
}
</script>

<style lang="stylus" scoped>
</style>
